import React from 'react'
import '../../../assets/css/home/menuRight/commonMenu.sass'

export default function CommonMenu() {
    const menuData = [{ id: '1', name: '商品列表' }, { id: '2', name: '添加商品' }, { id: '3', name: '订单列表' },
    { id: '4', name: '用户管理' }, { id: '5', name: '交易统计' }, { id: '6', name: '广告管理' },
    { id: '7', name: '专题列表' }, { id: '8', name: '部门管理' }, { id: '9', name: '成员管理' }]
    function MenuItem() {
        return (
            menuData.map((item, index) => {
                return <li key={index}><span>{item.name}</span></li>
            })
        )
    }

    return (
        <div className='commonMenu'>
            <header>
                <span>常用菜单</span>
                <span style={{ color: '#1890ff', cursor: 'pointer' }}>菜单管理</span>
            </header>
            <main>
                <ul className='clearfix'>
                    {MenuItem()}
                </ul>
            </main>
        </div>
    )
}
